<template>
  <el-card>
    <div style="display: flex; justify-content: space-between">
      <!-- 左边 -->
      <div style="width: 60%">
        <div class="job-name" @click="goToDetail">
          {{ job.name }}
        </div>
        <div class="row">
          <div style="color: red">
            {{ job.salary }}
          </div>
          <div style="border-left: 1px solid rgb(172, 172, 172)">
            {{ job.address }}
          </div>
          <div style="border-left: 1px solid rgb(172, 172, 172)">
            {{ job.education }}
          </div>
          <div style="border-left: 1px solid rgb(172, 172, 172)">
            {{ job.experience }}
          </div>
        </div>
        <div class="row">
          <div style="color: rgb(126, 126, 126)">
            {{ job.releaseTime }}
          </div>
          <!-- <div style="border-left:1px solid rgb(172, 172, 172);color: rgb(126, 126, 126);margin-left:6px;">
            {{job.reply}}
          </div> -->
        </div>
      </div>
      <!-- 右边 -->
      <div
        style="
          width: 40%;
          border-left: 1px dotted black;
          padding: 5px 20px;
          font-size: 14px;
        "
      >
        <div>
          {{ job.company.name }}
        </div>
        <div style="padding: 12px 0px">
          {{ job.company.type }}
        </div>
      </div>
    </div>
  </el-card>
</template>

<script>
export default {
  props: ["job"],
  emits: ["toDetial"],
  methods: {
    // 获得id
    push(id) {
      console.log(this.job);
      console.log(id, "我被点啦!");
    },
    goToDetail() {
      // router
      // this.$router.push({
      //   path: "/employee/job",
      //   params: { id: this.id },
      // });
      this.$router.push("/employee/job/" + this.job.id)
    },
  },
};
</script>

<style>
.job-name {
  font-size: 20px;
  color: rgb(64, 102, 173);
}
.job-name:hover {
  color: rgb(248, 158, 55);
  cursor: pointer;
}
.row {
  display: flex;
  margin-top: 6px;
}
.row > div {
  padding: 5px;
  font-size: 14px;
  color: rgb(46, 46, 46);
}
</style>